<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>网络知识（1） | 小小错题本</title>
    <meta name="description" content="互联网设计初，自带一个问题：浏览器和服务器的识别问题。
&gt; http 是无连接的，请求完毕之后，链接就会断掉。没有长久的数据通路。

1. Cookie

Cookie 就是在下行 HTTP 响应的报文中，添加 set-cookie 属性，要求浏览器设置 cookie。

![set cookie](https://s2.ax1x.com/2019/07/28/elJjhQ. ...">
    <meta name="generator" content="VuePress 1.3.0">
    
    
    <link rel="preload" href="/wrong_question_static_page/assets/css/0.styles.f30cb765.css" as="style"><link rel="preload" href="/wrong_question_static_page/assets/js/app.9022c753.js" as="script"><link rel="preload" href="/wrong_question_static_page/assets/js/4.8c1e4aa5.js" as="script"><link rel="preload" href="/wrong_question_static_page/assets/js/5.33f70f09.js" as="script"><link rel="preload" href="/wrong_question_static_page/assets/js/19.edba2346.js" as="script"><link rel="prefetch" href="/wrong_question_static_page/assets/js/1.ec18c3a1.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/10.697d33d5.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/11.488795fa.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/12.12a9963e.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/13.9d026eb1.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/14.c44f0e4a.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/15.a258b8bb.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/16.92328039.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/17.c4f16e4e.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/18.4dfa396f.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/20.082608a3.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/21.5ae0ad82.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/22.89457782.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/23.53bf9e28.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/24.ae06dfc6.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/25.1d7d04a4.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/6.af07a62f.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/7.2c342931.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/8.2545b8d2.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/9.0eaa1c27.js"><link rel="prefetch" href="/wrong_question_static_page/assets/js/vuejs-paginate.c4011005.js">
    <link rel="stylesheet" href="/wrong_question_static_page/assets/css/0.styles.f30cb765.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div id="vuepress-theme-blog__global-layout"><section id="header-wrapper"><header id="header"><div class="header-wrapper"><div class="title"><a href="/wrong_question_static_page/" class="nav-link home-link">小小错题本 </a></div> <div class="header-right-wrap"><ul class="nav"><li class="nav-item"><a href="/wrong_question_static_page/tag/" class="nav-link">分类</a></li></ul> <div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <!----></div></div></header></section> <div id="mobile-header"><div class="mobile-header-bar"><div class="mobile-header-title"><a href="/wrong_question_static_page/" class="nav-link mobile-home-link">小小错题本 </a> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu"><line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg></div> <div class="mobile-menu-wrapper"><hr class="menu-divider"> <ul class="mobile-nav"><li class="mobile-nav-item"><a href="/wrong_question_static_page/tag/" class="nav-link">分类</a></li> <li class="mobile-nav-item"><!----></li></ul></div></div></div> <div class="content-wrapper"><div id="vuepress-theme-blog__post-layout"><article itemscope="itemscope" itemtype="https://schema.org/BlogPosting" class="vuepress-blog-theme-content"><header><h1 itemprop="name headline" class="post-title">
        网络知识（1）
      </h1> <div class="post-meta"><!----> <div class="post-meta-date"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-clock"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg> <time pubdate itemprop="datePublished" datetime="2019-07-28T13:57:38.000Z">
      Sun Jul 28 2019
    </time></div> <ul itemprop="keywords" class="post-meta-tags"><li class="post-tag" data-v-2ac33c20><a href="/wrong_question_static_page/tag/http" data-v-2ac33c20> http </a></li><li class="post-tag" data-v-2ac33c20><a href="/wrong_question_static_page/tag/前端" data-v-2ac33c20> 前端 </a></li></ul></div></header> <div itemprop="articleBody" class="content__default"><blockquote><p>互联网设计初，自带一个问题：浏览器和服务器的<code>识别问题</code>。
http 是无连接的，请求完毕之后，链接就会断掉。没有长久的数据通路。</p></blockquote> <h4 id="_1-cookie"><a href="#_1-cookie" class="header-anchor">#</a> 1. Cookie</h4> <ul><li>Cookie 就是在下行 HTTP 响应的报文中，添加 set-cookie 属性，要求浏览器设置 cookie。</li></ul> <p><img src="https://s2.ax1x.com/2019/07/28/elJjhQ.png" alt="set cookie"></p> <ul><li>浏览器在每一次请求中都需要在上行的请求报文头中，携带 cookie 上去，告诉服务器：“我是谁”！ 方便服务器对自己的识别。</li></ul> <p><img src="https://s2.ax1x.com/2019/07/28/elJz1s.png" alt="post cookie"></p> <blockquote><p>优点：简单，明文存储</p></blockquote> <blockquote><p>缺点：太过简单，容易被修改；明文存储，不安全；修改简单。需要每次请求时带上 cookie 发送给服务器。效率低。服务器端需要不断的 set_cookie.</p></blockquote> <ul><li><p>cookie 的用途：</p> <p>1） 存储数据（有 H5 本地存储之前）</p></li></ul> <h4 id="_2-session"><a href="#_2-session" class="header-anchor">#</a> 2. Session</h4> <p>Session 就是密文的 cookie。Session 不是新技术，只是设置 cookie 为一个乱码的字符串。</p> <p><img src="https://s2.ax1x.com/2019/07/28/elJxpj.png" alt="post cookie"></p> <ul><li>服务器和浏览器识别的唯一信息就是这个乱码字符串。</li></ul> <h4 id="_3-token"><a href="#_3-token" class="header-anchor">#</a> 3. Token</h4> <p>两个解密算法：
SHA256 、MD5</p> <blockquote><p>MD5: MD5 消息摘要算法（英语：MD5 Message-Digest Algorithm），一种被广泛使用的密码散列函数，可以产生出一个 128 位（16 字节）的散列值（hash value），用于确保信息传输完整一致。加密算法包含信息：（ip、手机号、浏览器版本、系统版本等）</p></blockquote> <ul><li>这两个加密算法都不可逆 ==[可以加密，但不可以反向解密]==</li></ul> <blockquote><p>关键点：服务器掌握信息的算法，而浏览器只是掌握信息本身！</p></blockquote> <blockquote><p>token 是一个加密的字符串。里面包含有个人身份信息。token 不能判断用户是谁，只能校验数据合法性。</p></blockquote> <h4 id="_4-跨域"><a href="#_4-跨域" class="header-anchor">#</a> 4. 跨域</h4> <h5 id="_4-1-代理跨域"><a href="#_4-1-代理跨域" class="header-anchor">#</a> 4.1 代理跨域</h5> <p>浏览器有跨域限制，但是服务器不存在跨域问题，所以可以由服务器请求所要域的资源再返回给客户端。服务器代理是万能的。</p> <p>代理服务器就是浏览器端A与请求服务器端C之间存在一个和浏览器同源的代理服务器B。浏览器A发送的请求都会被代理服务器B处理，发送个服务器C，然后把C的响应给浏览器A。</p> <h5 id="_4-2-cors"><a href="#_4-2-cors" class="header-anchor">#</a> 4.2 CORS</h5> <p>CORS ：Cross-origin resource sharing，跨域资源共享。 就是被访问请求的服务器“自己”设置为 允许某些或者所有非同源客户端请求。此设置需要服务端修改。实现 CORS 通信的关键是服务器。只要服务器实现了 CORS 接口，就可以跨源通信。CORS 需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能，IE 浏览器不能低于 IE10。</p></div> <footer><!----> <hr> <!----></footer></article> <!----></div></div> <footer class="footer" data-v-06e1b74b><div class="footer-left-wrap" data-v-06e1b74b><ul class="contact" data-v-06e1b74b></ul></div> <div class="footer-right-wrap" data-v-06e1b74b><ul class="copyright" data-v-06e1b74b></ul></div></footer></div><div class="global-ui"><!----></div></div>
    <script src="/wrong_question_static_page/assets/js/app.9022c753.js" defer></script><script src="/wrong_question_static_page/assets/js/4.8c1e4aa5.js" defer></script><script src="/wrong_question_static_page/assets/js/5.33f70f09.js" defer></script><script src="/wrong_question_static_page/assets/js/19.edba2346.js" defer></script>
  </body>
</html>
